<template>
  <div class="dibu">
  <ul class="horizontal gray">
    <router-link to="/dynamic" class="di"><div class="sd"><img src="../pages/dynamic/tupian/c1.png" alt=""><span>动态</span></div></router-link>
    <router-link to="/data" class="di"><div class="sd"> <img src="../pages/dynamic/tupian/c2.png" alt=""><span>数据</span></div></router-link>
    <router-link to="/notice" class="di"><div class="sd"><img src="../pages/dynamic/tupian/c3.png" alt=""><span>通知</span></div></router-link>
    <router-link to="/mine" class="di"><div class="sd"><img src="../pages/dynamic/tupian/c4.png" alt=""><span>我的</span></div></router-link>
  </ul>
</div>
<router-view></router-view>
</template>

<script>
export default {};
</script>

<style land="less"  scoped>
ul {
  z-index: 11;
  background-color: white;
    display: flex;
    position: fixed;
    bottom: 0;
    width: 100vw;
    text-align:center;

  }
  .di{
    width: 100%;
    padding: 0 1.875rem 0 1.875rem;
  }
  .sd{
    width: 35px;
  }
.di {
  padding: 0 30px 0 30px;
}
</style>